<template>
  <div class="app-container">
    <el-row :gutter="20">
      <el-col :span="18">
        <el-skeleton :rows="15" animated v-if="!customerVO.customer"/>
        <el-card class="box-card" shadow="never" style="height: 795px;" v-else>
          <el-tabs v-model="activeName" @tab-click="handleClick">
            <el-tab-pane label="用户信息" name="first" />
            <el-tab-pane label="外呼记录" name="second" />
            <el-tab-pane label="操作日志" name="third" />
          </el-tabs>
          <el-descriptions contentClassName="descriptionsText">
            <template slot="title">
              <i class="el-icon-user-solid"></i>
              基础信息<span v-if="isBlacklist" style="color:red; font-weight: bold;">（当前客户被拉黑，请慎重跟进，拉黑原因：{{blacklist.reason}}）</span>
              <i class="el-icon-edit-outline icon-local" @click="updateBaseOpen" />

              <el-link class="icon-local"
                         style="margin-right: 20px; padding: 0;"
                         icon="el-icon-plus"
                         v-if="!isBlacklist"
                         type="danger"
                         @click="handleAddBlacklist">加入黑名单</el-link>
            </template>
            <el-descriptions-item label="客户ID">{{customerVO.customer.id}}</el-descriptions-item>
            <el-descriptions-item label="昵称">
              <span>
                {{customerVO.customer.nickname == null ? "--" : customerVO.customer.nickname}}
              </span>
            </el-descriptions-item>
            <el-descriptions-item label="姓名">{{customerVO.customer.customerName == null ? "--" : customerVO.customer.customerName}}</el-descriptions-item>
            <el-descriptions-item label="公司">{{customerVO.customer.companyName == null ? "--" : customerVO.customer.companyName}}</el-descriptions-item>
            <el-descriptions-item label="备注名称" v-if="customerVO.defaultRelationship">
              <span>
                {{customerVO.defaultRelationship.nameNotes == null ? "--" : customerVO.defaultRelationship.nameNotes}}
              </span>
            </el-descriptions-item>
            <el-descriptions-item label="性别">
              <dict-tag :options="dict.type.sys_user_sex" :value="customerVO.customer.gender"/>
            </el-descriptions-item>
            <el-descriptions-item label="年龄">{{customerVO.customer.age == null ? "--" : customerVO.customer.age}}</el-descriptions-item>
            <el-descriptions-item label="会员ID">{{customerVO.customer.memberId == null ? "--" : customerVO.customer.memberId}}</el-descriptions-item>
            <el-descriptions-item label="标签" v-if="customerVO.defaultRelationship">
              <el-tag size="small" style="margin-right: 5px;" v-for="item in customerVO.defaultRelationship.tagList">
                {{ item }}
              </el-tag>
            </el-descriptions-item>
          </el-descriptions>

          <el-divider></el-divider>

          <el-descriptions contentClassName="descriptionsText" style="margin-top: 30px;">
            <template slot="title">
              <i class="el-icon-s-comment"></i>
              联系信息
              <i class="el-icon-edit-outline icon-local" @click="updateLinkOpen" />
            </template>
            <el-descriptions-item label="手机号">
              {{customerVO.customer.phoneNumber}}
              <el-link v-if="customerVO.customer.phoneNumber" type="info" style="margin-left: 5px;" icon="el-icon-phone" :underline="false" @click="callPhone(customerVO.customer.phoneNumber)">呼叫</el-link>
            </el-descriptions-item>
            <el-descriptions-item label="电话号">
              {{customerVO.customer.telephone == null ? "--" : customerVO.customer.telephone}}
              <el-link v-if="customerVO.customer.telephone" type="info" style="margin-left: 5px;" icon="el-icon-phone" :underline="false" @click="callPhone(customerVO.customer.telephone)">呼叫</el-link>
            </el-descriptions-item>
            <el-descriptions-item label="邮箱">{{customerVO.customer.email == null ? "--" : customerVO.customer.email}}</el-descriptions-item>
            <el-descriptions-item label="微信">{{customerVO.customer.wx == null ? "--" : customerVO.customer.wx}}</el-descriptions-item>
            <el-descriptions-item label="QQ号">{{customerVO.customer.qq == null ? "--" : customerVO.customer.qq}}</el-descriptions-item>
            <el-descriptions-item label="地区">{{customerVO.customer.province}} &nbsp; {{customerVO.customer.city}}</el-descriptions-item>
            <el-descriptions-item label="地址">{{customerVO.customer.province}} &nbsp; {{customerVO.customer.city}} &nbsp; {{customerVO.customer.address}}</el-descriptions-item>
            <el-descriptions-item label="最后跟进时间">{{customerVO.customer.lastContactTime == null ? '--' : customerVO.customer.lastContactTime}}</el-descriptions-item>
          </el-descriptions>

          <el-divider></el-divider>

          <el-descriptions contentClassName="descriptionsText" style="margin-top: 30px;">
            <template slot="title">
              <i class="el-icon-menu"></i>
              其他信息
              <i class="el-icon-edit-outline icon-local" @click="updateOtherOpen" />
            </template>
            <el-descriptions-item label="客户类型">
                <dict-tag :options="dict.type.crm_customer_type" :value="customerVO.customer.customerType"/>
              <span v-if=""></span>
            </el-descriptions-item>
            <el-descriptions-item label="职位">{{ customerVO.customer.position == null ? "--" : customerVO.customer.position }}</el-descriptions-item>
            <el-descriptions-item label="客户等级">
              <dict-tag :options="dict.type.crm_customer_level" :value="customerVO.customer.customerLevel"/>
            </el-descriptions-item>
            <el-descriptions-item label="跟进状态" v-if="customerVO.defaultRelationship">
              <dict-tag :options="dict.type.customer_state" :value="customerVO.defaultRelationship.customerState"/>
            </el-descriptions-item>
            <el-descriptions-item label="关系状态" v-if="customerVO.defaultRelationship">
              <dict-tag :options="dict.type.relationship_status" :value="customerVO.defaultRelationship.relationshipStatus"/>
            </el-descriptions-item>
            <el-descriptions-item label="客户来源">{{ customerVO.customer.source == null ? "--" : customerVO.customer.source }}</el-descriptions-item>
            <el-descriptions-item label="跟进来源" v-if="customerVO.defaultRelationship">
              {{ customerVO.defaultRelationship.source == null ? "--" : customerVO.defaultRelationship.source}}
            </el-descriptions-item>
            <el-descriptions-item label="所属行业">{{ customerVO.customer.industry == null ? "--" : customerVO.customer.industry }}</el-descriptions-item>
            <el-descriptions-item label="公司规模">{{ customerVO.customer.staffSize == null ? "--" : customerVO.customer.staffSize }}</el-descriptions-item>
            <el-descriptions-item label="资金规模">{{ customerVO.customer.fundSize == null ? "--" : customerVO.customer.fundSize }}</el-descriptions-item>
            <el-descriptions-item label="客户习惯">{{customerVO.customer.habit == null ? "--" : customerVO.customer.habit}}</el-descriptions-item>
            <el-descriptions-item label="客户描述">
              <div style="height: 30px">
                {{ customerVO.customer.customerNote == null ? "--" : customerVO.customer.customerNote}}
              </div>
            </el-descriptions-item>
          </el-descriptions>

          <el-divider></el-divider>

          <el-descriptions contentClassName="descriptionsText" style="margin-top: 30px;" :column="4">
            <template slot="title">
              <i class="el-icon-s-home"></i>
              系统信息
            </template>
            <el-descriptions-item label="创建人">{{ customerVO.customer.createBy == null ? '--' : customerVO.customer.createBy }}</el-descriptions-item>
            <el-descriptions-item label="创建时间">{{ customerVO.customer.createTime }}</el-descriptions-item>
            <el-descriptions-item label="更新人">{{ customerVO.customer.updateBy == null ? '--' : customerVO.customer.updateBy }}</el-descriptions-item>
            <el-descriptions-item label="更新时间">{{ customerVO.customer.updateTime == null ? "--" : customerVO.customer.updateTime }}</el-descriptions-item>
          </el-descriptions>

        </el-card>
      </el-col>

      <el-col :span="6">
        <el-skeleton :rows="15" animated v-if="!customerVO.customer"/>
        <el-card class="box-card" shadow="never" style="height: 795px; overflow: auto;" v-else>
          <div slot="header" class="clearfix">
            <span style="font-weight:bold">跟进记录</span>
            <el-button style="float: right; padding: 3px 0"
                       icon="el-icon-plus"
                       type="text"
                       v-if="customerVO.defaultRelationship"
                       @click="handleAdd">添加跟进</el-button>
          </div>

          <el-empty description="暂无跟进记录" v-if="followList.length == 0"></el-empty>
          <el-steps :space='100' direction="vertical" :active="1" v-else>
            <el-step v-for="item in followList"
                     :title="item.createTime"
                     icon="el-icon-success">
              <template slot="description">
                <span style="margin-right: 3px">{{item.employeeNickname}}：</span>
                <span>{{ item.followContent }}</span>
              </template>
            </el-step>
          </el-steps>

        </el-card>
      </el-col>
    </el-row>


    <el-skeleton :rows="15" animated v-if="!customerVO.customer"/>
    <el-card class="box-card" shadow="never" style="height: 380px;" v-else>
      <div slot="header" class="clearfix">
        <span style="font-weight:bold">跟进员工</span>
      </div>
      <el-row :gutter="12">
        <el-empty description="暂无跟进员工" v-if="customerVO.relationships.length == 0"></el-empty>
        <el-col :span="5" v-for="item in customerVO.relationships" v-else>
          <el-card class="box-card" shadow="never" style="height: 300px; overflow: auto">
            <el-descriptions contentClassName="descriptionsText" :column="1">
              <el-descriptions-item label="跟进人">{{item.employeeName}}</el-descriptions-item>
              <el-descriptions-item label="跟进时间">{{ item.createTime }}</el-descriptions-item>
              <el-descriptions-item label="跟进状态">
                <dict-tag :options="dict.type.customer_state" :value="item.customerState"/>
              </el-descriptions-item>
              <el-descriptions-item label="关系状态">
                <dict-tag :options="dict.type.relationship_status" :value="item.relationshipStatus"/>
              </el-descriptions-item>
              <el-descriptions-item label="备注名称">{{ item.nameNotes }}</el-descriptions-item>
              <el-descriptions-item label="添加来源">{{item.source}}</el-descriptions-item>
              <el-descriptions-item label="标签">
                <el-tag size="small" style="margin-right: 5px;" v-for="i in item.tagList">
                  {{ i }}
                </el-tag>
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
      </el-row>
    </el-card>

    <!-- 添加跟进 -->
    <el-dialog title="添加跟进记录" :visible.sync="open" width="700px" append-to-body :close-on-click-modal="false">
      <el-form ref="form" :model="form" :rules="rules" label-width="0px">
        <el-form-item prop="followContent">
          <el-input type="textarea" :rows="7" placeholder="请输入跟进内容" v-model="form.followContent"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm" :loading="buttonLoading">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
    <!-- 修改基础信息 -->
    <el-dialog title="修改基础信息" :visible.sync="baseOpen" width="700px" append-to-body :close-on-click-modal="false">
      <el-form ref="baseForm" :model="baseForm" :rules="rules" label-width="150px">
        <el-form-item label="备注名（个人可见）" prop="nameNotes" v-if="customerVO.defaultRelationship">
          <el-input placeholder="备注名（个人可见）" v-model="baseForm.nameNotes"/>
        </el-form-item>
        <el-form-item label="标签（个人可见）" prop="tags" v-if="customerVO.defaultRelationship">
          <el-input placeholder="标签（个人可见），多个标签，以英文的,分隔" v-model="baseForm.tags"/>
        </el-form-item>
        <el-form-item label="姓名（公司可见）" prop="customerName">
          <el-input placeholder="真实姓名（公司可见）" v-model="baseForm.customerName"/>
        </el-form-item>
        <el-form-item label="昵称（公司可见）" prop="nickname">
          <el-input placeholder="客户昵称（公司可见）" v-model="baseForm.nickname"/>
        </el-form-item>
        <el-form-item label="年龄（公司可见）" prop="age">
          <el-input placeholder="年龄（公司可见）" v-model="baseForm.age"/>
        </el-form-item>
        <el-form-item label="公司（公司可见）" prop="companyName">
          <el-input placeholder="请输入所属公司名称" v-model="baseForm.companyName"/>
        </el-form-item>
        <el-form-item label="会员ID（公司可见）" prop="memberId">
          <el-input placeholder="会员ID（可绑定公司内部系统的ID）" v-model="baseForm.memberId"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="updateBaseSubmit" :loading="buttonLoading">确 定</el-button>
        <el-button @click="updateBaseCancel">取 消</el-button>
      </div>
    </el-dialog>
    <!-- 修改联系信息 -->
    <el-dialog title="修改联系信息" :visible.sync="linkOpen" width="700px" append-to-body :close-on-click-modal="false">
      <el-form ref="linkForm" :model="linkForm" :rules="rules" label-width="150px">
        <el-form-item label="手机号" prop="phoneNumber">
          <el-input placeholder="手机号" v-model="linkForm.phoneNumber"/>
        </el-form-item>
        <el-form-item label="电话号" prop="telephone">
          <el-input placeholder="电话号，可存其他手机号" v-model="linkForm.telephone"/>
        </el-form-item>
        <el-form-item label="微信" prop="wx">
          <el-input placeholder="微信" v-model="linkForm.wx"/>
        </el-form-item>
        <el-form-item label="邮箱" prop="email">
          <el-input placeholder="邮箱" v-model="linkForm.email"/>
        </el-form-item>
        <el-form-item label="QQ" prop="qq">
          <el-input placeholder="QQ" v-model="linkForm.qq"/>
        </el-form-item>
        <el-form-item label="详细地址" prop="address">
          <el-input placeholder="详细地址" v-model="linkForm.address"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="updateLinkSubmit" :loading="buttonLoading">确 定</el-button>
        <el-button @click="updateLinkCancel">取 消</el-button>
      </div>
    </el-dialog>
    <!-- 修改其他信息 -->
    <el-dialog title="修改其他信息" :visible.sync="otherOpen" width="700px" append-to-body :close-on-click-modal="false">
      <el-form ref="otherForm" :model="otherForm" :rules="rules" label-width="150px">
        <el-form-item label="客户类型" prop="customerType">
          <el-select v-model="otherForm.customerType" placeholder="请选择客户类型">
            <el-option
              v-for="dict in dict.type.crm_customer_type"
              :key="dict.value"
              :label="dict.label"
              :value="dict.value"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="职位" prop="position">
          <el-input v-model="otherForm.position" placeholder="请输入职位" />
        </el-form-item>
        <el-form-item label="客户等级" prop="customerLevel">
          <el-select v-model="otherForm.customerLevel" placeholder="请选择客户等级">
            <el-option
              v-for="dict in dict.type.crm_customer_level"
              :key="dict.value"
              :label="dict.label"
              :value="dict.value"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="跟进状态" prop="customerState" v-if="customerVO.defaultRelationship">
          <el-select v-model="otherForm.customerState" placeholder="请选择跟进状态">
            <el-option
              v-for="dict in dict.type.customer_state"
              :key="dict.value"
              :label="dict.label"
              :value="dict.value"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="关系状态" prop="relationshipStatus" v-if="customerVO.defaultRelationship">
          <el-radio-group v-model="otherForm.relationshipStatus">
            <el-radio
              v-for="dict in dict.type.relationship_status"
              :key="dict.value"
              :label="dict.value"
            >{{dict.label}}</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="所属行业" prop="industry">
          <el-input placeholder="请输入所属行业" v-model="otherForm.industry"/>
        </el-form-item>
        <el-form-item label="公司规模" prop="staffSize">
          <el-input placeholder="请输入公司规模" v-model="otherForm.staffSize"/>
        </el-form-item>
        <el-form-item label="资金规模" prop="fundSize">
          <el-input placeholder="请输入资金规模" v-model="otherForm.fundSize"/>
        </el-form-item>
        <el-form-item label="客户习惯" prop="habit">
          <el-input placeholder="请输入客户习惯" v-model="otherForm.habit"/>
        </el-form-item>
        <el-form-item label="客户描述" prop="customerNote">
          <el-input placeholder="请输入客户描述" v-model="otherForm.customerNote"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="updateOtherSubmit" :loading="buttonLoading">确 定</el-button>
        <el-button @click="updateOtherCancel">取 消</el-button>
      </div>
    </el-dialog>

    <!-- 修改其他信息 -->
    <el-dialog title="修改其他信息" :visible.sync="blacklistOpen" width="700px" append-to-body :close-on-click-modal="false">
      <el-form ref="blacklistForm" :model="blacklistForm" :rules="rules" label-width="0">
        <el-form-item prop="reason">
          <el-input type="textarea" :rows="3" v-model="blacklistForm.reason" placeholder="请输入拉黑原因" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="addBlacklist">确 定</el-button>
        <el-button @click="blacklistCancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {allocationCustomer, getCustomerVO, updateCustomer} from "@/api/hrcrm/customer";
import { mapActions, mapState } from 'vuex';
import {addFollow, listFollow} from "@/api/hrcrm/follow";
import {updateRelationship} from "@/api/hrcrm/relationship";
import {addBlacklist, getInfoByMchIdAndCustomerId} from "@/api/hrcrm/blacklist";

export default {
  name: "CustomerDetail",
  dicts: ['crm_customer_level', 'crm_customer_type', 'sys_user_sex', 'tf', 'customer_state', 'relationship_status'],
  data() {
    return {
      // 遮罩层
      loading: true,
      buttonLoading: false,
      activeName: 'first',

      // 二级部门列表
      deptList: [],
      // 是否部门领导
      isLeader: true,
      // 是否管理员
      isAdmin: false,
      userParams: [],
      loginUserId: null,
      // 是否在黑名单
      isBlacklist: false,
      blacklist: null,
      // 客户ID
      customerId: this.$route.query && this.$route.query.id || null,
      // 员工ID
      employeeId: this.$route.query && this.$route.query.employeeId || null,
      // 商户ID
      mchId: this.$route.query && this.$route.query.mchId || null,
      // 客户实体
      customerVO: {
        customer: null,
        relationships: null,
        defaultRelationship: null
      },
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 999,
        mchId: null,
        customerId: null,
        employeeId: null,
      },
      followList: [],
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        followContent: [
          { required: true, message: "跟进内容不能为空", trigger: "blur" }
        ],
        // baseForm start
        /*nameNotes: [
          { required: true, message: "备注名不能为空", trigger: "blur" }
        ],*/
        customerName: [
          { required: true, message: "客户姓名不能为空", trigger: "blur" }
        ],
        // baseForm end
        // linkForm start
        phoneNumber: [
          { required: true, message: '请输入手机号码', trigger: 'blur' },
          {
            required: true,
            pattern: /^[1][3,4,5,6,7,8,9][0-9]{9}$/,
            message: '请输入正确的手机号码',
            trigger: 'blur',
          },
        ],
        /*telephone: [
          {
            required: false,
            pattern: /^(\d{3,4}-)?\d{11}$/,
            message: '请输入正确的电话号码',
            trigger: 'blur',
          },
        ],*/
        // linkForm end
        reason: [
          { required: true, message: "拉黑原因不能为空", trigger: "blur" }
        ],
      },
      baseOpen: false,
      baseForm: {
        nameNotes: null,
        tags: null,
        customerName: null,
        nickname: null,
        memberId: null,
        age: null,
        companyName: null
      },
      linkOpen: false,
      linkForm: {
        phoneNumber: null,
        telephone: null,
        wx: null,
        qq: null,
        email: null,
        address: null
      },
      otherOpen: false,
      otherForm: {
        customerType: null,
        position: null,
        customerLevel: null,
        customerState: null,
        relationshipStatus: null,
        industry: null,
        staffSize: null,
        fundSize: null,
        habit: null,
        customerNote: null
      },
      blacklistOpen: false,
      blacklistForm: {
        reason: null
      }
    };
  },
  created() {
    this.getDetails();
  },
  activated() {
    this.getDetails();
  },
  methods: {
    ...mapActions('call', ['agentAutoCall']),
    // 获取客户详情
    getDetails() {
      this.customerId = this.$route.query && this.$route.query.id || null;
      this.employeeId = this.$route.query && this.$route.query.employeeId || null;
      this.mchId = this.$route.query && this.$route.query.mchId || null;
      if (!this.customerId) {
        this.$modal.msgError("用户信息错误");
        return;
      }

      let query = '{"customerId": ' + this.customerId + ', "employeeId": ' + this.employeeId + ', "mchId": '+ this.mchId +'}'
      getCustomerVO(JSON.parse(query)).then(response => {
        this.customerVO = response.data;
        // 获取黑名单
        this.getBlacklist();
      });

      // 获取跟进记录
      this.getListFollow()
    },
    /** 获取跟进记录 */
    getListFollow() {
      this.queryParams.customerId = this.customerId
      this.queryParams.mchId = this.mchId
      // this.queryParams.employeeId = this.employeeId
      listFollow(this.queryParams).then(response => {
        this.followList = response.rows;
      });
    },
    // 拨打电话
    callPhone(number){
      let tel = number || "";
      let obClid = this.obClid || "";
      this.agentAutoCall({tel,obClid});
    },
    // 标题切换
    handleClick(tab, event) {
      console.log(tab, event);
    },

    /** 跟进记录 新增按钮操作 */
    handleAdd() {
      this.open = true;
    },
    /** 跟进记录 取消按钮 */
    cancel() {
      this.open = false;
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          // 参数赋值
          this.form.mchId = this.customerVO.customer.mchId;
          this.form.customerId = this.customerVO.customer.id;
          this.form.employeeId = this.customerVO.defaultRelationship.employeeId;
          this.form.employeeNickname = this.customerVO.defaultRelationship.employeeName;
          this.form.follow_type = 'FOLLOW';

          addFollow(this.form).then(response => {
            this.$modal.msgSuccess("新增成功");
            this.open = false;
            this.getListFollow();
          });
        }
      });
    },

    // 修改start
    updateBaseOpen() {
      if (this.customerVO.defaultRelationship) {
        this.baseForm.nameNotes = this.customerVO.defaultRelationship.nameNotes
        this.baseForm.tags = this.customerVO.defaultRelationship.tags
        this.baseForm.age = this.customerVO.defaultRelationship.age
      }
      this.baseForm.customerName = this.customerVO.customer.customerName
      this.baseForm.nickname = this.customerVO.customer.nickname
      this.baseForm.memberId = this.customerVO.customer.memberId
      this.baseForm.companyName = this.customerVO.customer.companyName
      this.baseOpen = true;
    },
    updateBaseCancel() {
      this.baseOpen = false;
      this.resetForm("baseForm");
    },
    updateBaseSubmit() {
      this.$refs["baseForm"].validate(valid => {
        if (valid) {
          this.buttonLoading = true;
          let result;

          // 数据验证
          if (this.customerVO.defaultRelationship) {
            if (this.customerVO.defaultRelationship && (this.baseForm.nameNotes != this.customerVO.defaultRelationship.nameNotes
              || this.baseForm.tags != this.customerVO.defaultRelationship.tags
              || this.baseForm.age != this.customerVO.defaultRelationship.age)) {
              let baseUpdateRelationship = {id: this.customerVO.defaultRelationship.id, nameNotes: this.baseForm.nameNotes
                , tags: this.baseForm.tags, age: this.baseForm.age}
              updateRelationship(baseUpdateRelationship).then(response => {
                result = true;
              })
            }
          }

          if (this.baseForm.customerName != this.customerVO.customer.customerName
            || this.baseForm.nickname != this.customerVO.customer.nickname || this.baseForm.memberId != this.customerVO.customer.memberId
            || this.baseForm.companyName != this.customerVO.customer.companyName) {
            let baseUpdateCustomer = {id: this.customerVO.customer.id, customerName: this.baseForm.customerName,
              nickname: this.baseForm.nickname, memberId: this.baseForm.memberId, companyName: this.baseForm.companyName}
            updateCustomer(baseUpdateCustomer).then(response => {
              result = true;
            })
          }

          setTimeout(() => {
            if(result) {
              this.buttonLoading = false;
              this.baseOpen = false;
              this.getDetails();
            }
          }, 1000)
        }
      });
    },
    updateLinkOpen() {
      this.linkForm.phoneNumber = this.customerVO.customer.phoneNumber
      this.linkForm.telephone = this.customerVO.customer.telephone
      this.linkForm.wx = this.customerVO.customer.wx
      this.linkForm.qq = this.customerVO.customer.qq
      this.linkForm.email = this.customerVO.customer.email
      this.linkForm.address = this.customerVO.customer.address
      this.linkOpen = true;
    },
    updateLinkCancel() {
      this.linkOpen = false;
      this.resetForm("linkForm");
    },
    updateLinkSubmit() {
      this.$refs["linkForm"].validate(valid => {
        if (valid) {
          this.buttonLoading = true;
          this.linkForm.id = this.customerVO.customer.id
          updateCustomer(this.linkForm).then(response => {
            this.linkOpen = false;
            this.buttonLoading = false;
            this.getDetails();
          })
        }
      });
    },
    updateOtherOpen() {
      if (this.customerVO.defaultRelationship) {
        this.otherForm.customerState = this.customerVO.defaultRelationship.customerState
        this.otherForm.relationshipStatus = this.customerVO.defaultRelationship.relationshipStatus
      }
      this.otherForm.customerType = this.customerVO.customer.customerType
      this.otherForm.customerLevel = this.customerVO.customer.customerLevel
      this.otherForm.industry = this.customerVO.customer.industry
      this.otherForm.staffSize = this.customerVO.customer.staffSize
      this.otherForm.fundSize = this.customerVO.customer.fundSize
      this.otherForm.habit = this.customerVO.customer.habit
      this.otherForm.customerNote = this.customerVO.customer.customerNote
      this.otherOpen = true;
    },
    updateOtherCancel() {
      this.otherOpen = false;
      this.resetForm("otherForm");
    },
    updateOtherSubmit() {
      this.$refs["otherForm"].validate(valid => {
        if (valid) {
          this.buttonLoading = true;
          let result;
          if (this.customerVO.defaultRelationship) {
            if (this.otherForm.customerState != this.customerVO.defaultRelationship.customerState
              || this.otherForm.relationshipStatus != this.customerVO.defaultRelationship.relationshipStatus) {
              let otherUpdateRelationship = {id: this.customerVO.defaultRelationship.id,
                customerState: this.otherForm.customerState, relationshipStatus: this.otherForm.relationshipStatus}
              updateRelationship(otherUpdateRelationship).then(response => {
                result = true;
              })
            }
          }

          if (this.otherForm.customerType != this.customerVO.customer.customerType
            || this.otherForm.customerLevel != this.customerVO.customer.customerLevel
            || this.otherForm.industry != this.customerVO.customer.industry
            || this.otherForm.staffSize != this.customerVO.customer.staffSize
            || this.otherForm.fundSize != this.customerVO.customer.fundSize
            || this.otherForm.habit != this.customerVO.customer.habit
            || this.otherForm.customerNote != this.customerVO.customer.customerNote) {
            this.otherForm.id = this.customerVO.customer.id
            updateCustomer(this.otherForm).then(response => {
              result = true;
            })
          }

          setTimeout(() => {
            if(result) {
              this.buttonLoading = false;
              this.otherOpen = false;
              this.getDetails();
            }
          }, 1000)
        }
      });
    },
    // 获取黑名单
    getBlacklist() {
      let query = {mchId: this.customerVO.customer.mchId, customerId: this.customerVO.customer.id}
      getInfoByMchIdAndCustomerId(query).then(response => {
        if (response.data) {
          this.isBlacklist = true;
          this.blacklist = response.data
        }
      })
    },
    // 加入黑名单
    handleAddBlacklist(){
      this.blacklistOpen = true;
    },
    // 加入黑名单，关闭弹出框
    blacklistCancel(){
      this.blacklistOpen = false;
      this.resetForm("blacklistForm");
    },
    // 处理拉黑
    addBlacklist(){
      this.$refs["blacklistForm"].validate(valid => {
        if (valid) {
          this.$modal.confirm('确认要将该客户移至黑名单吗？')
            .then(function() {

            }).then(() => {
              this.blacklistForm.customerId = this.customerVO.customer.id
              this.blacklistForm.mchId = this.customerVO.customer.mchId
              addBlacklist(this.blacklistForm).then(response => {
                this.$modal.msgSuccess("拉黑成功");
                this.blacklistCancel();
              });
          }).catch(() => {
          });
        }
      });

    }
  }
};
</script>

<style>
.descriptionsText {
  color: #a4a4a4;
}
</style>

<style scoped>
.el-row {
  margin-bottom: 20px;
}
.text {
  font-size: 14px;
}
/deep/ .el-divider--horizontal{
  height: 0;
  background: 0 0;
  border-bottom: 1px dashed #DCDFE6;
}
/deep/ .el-descriptions__title{
  font-size: 16px;
  font-weight: bold;
  width: 98%;
}
.icon-local {
  float: right;
  padding: 3px 0
}
</style>
